[Fix] admin 동아리 정보설정 가로 스크롤 추가 + input 동적 글자수 추가#92
Conversation
PR 테스트 결과✅ Jest: 통과 🎉 모든 테스트를 통과했습니다! |
🤖 Claude 테스트 제안
변경된 컴포넌트에 대해 Claude가 생성한 테스트 코드입니다. 검토 후 적합한 부분만 사용하세요.
|
PR 검증 결과✅ TypeScript: 통과 🎉 모든 검증을 통과했습니다! |
|
구현한 기능 Preview: https://weeth-oibszy68q-weethsite-4975s-projects.vercel.app |
|
Warning Rate limit exceeded
To keep reviews running without waiting, you can enable usage-based add-on for your organization. This allows additional reviews beyond the hourly cap. Account admins can enable it under billing. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (3)
📝 Walkthrough요약Walkthrough관리자 동아리 정보 페이지의 레이아웃과 폼 입력 필드들이 업데이트되었습니다. 컨테이너 오버플로우 처리를 개선하고, 동아리 명 및 소개의 30자 제한과 실시간 문자 카운터를 추가했으며, 입력 필드의 패딩과 간격 스타일을 조정했습니다. Changes
예상 코드 리뷰 난이도🎯 3 (중간) | ⏱️ ~20분 관련 PR
추천 라벨
추천 리뷰어
🐰 축하 시
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Review rate limit: 0/1 reviews remaining, refill in 21 minutes and 1 second.Comment |
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
src/components/admin/club-info/ClubInfoPageContent.tsx (1)
132-139:⚠️ Potential issue | 🟠 Major
overflow-x-auto로 인해sticky상단바의 위치 기준이 변경됩니다.이 래퍼에
overflow-x-auto를 추가하면 새로운 스크롤 컨테이너를 만들어,ClubInfoTopBar의sticky top-0기준이 뷰포트가 아닌 이 내부 스크롤 영역이 됩니다. 외부main에서 이미 가로 스크롤을 처리하고 있고,MemberPageContent도 유사한 구조에서overflow-x-auto없이 정상 작동하므로 제거하는 것이 안전합니다.수정 예시
- <div className="flex w-full flex-col overflow-x-auto"> + <div className="flex w-full flex-col">🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/components/admin/club-info/ClubInfoPageContent.tsx` around lines 132 - 139, The wrapper div in ClubInfoPageContent (the element rendering ClubInfoTopBar when isEditMode is true) uses className "flex w-full flex-col overflow-x-auto", which creates an internal scroll container and breaks ClubInfoTopBar's sticky positioning; remove the overflow-x-auto from that wrapper so the sticky top-0 on ClubInfoTopBar is relative to the viewport (mirror the approach used in MemberPageContent), then run the page to verify the top bar stays fixed when editing.src/components/admin/club-info/ClubInfoContactSection.tsx (1)
31-36:⚠️ Potential issue | 🟡 Minor
pb-[40px]는 spacing 토큰으로 맞춰 주세요.임의 px 값을 직접 쓰고 있어서 토큰 체계와 어긋납니다.
pb-800을 사용하면 40px을 나타낼 수 있습니다.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/components/admin/club-info/ClubInfoContactSection.tsx` around lines 31 - 36, Replace the hard-coded pixel padding on the AdminInfoCard by using the spacing token system: change the className value that currently contains "pb-[40px]" to use the token "pb-800" (on the AdminInfoCard JSX element) so the component's padding aligns with the design token scale and avoids inline px values.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@src/components/auth/hub/CreateClubForm.tsx`:
- Around line 148-178: The problem is the counter shifts when FieldError is
empty; fix by keeping the error slot width stable: inside the container that
currently uses className="flex min-h-4 items-start justify-between gap-200",
replace it with a layout that fixes the error slot (e.g., use justify-end or
keep the two items but give the FieldError a fixed/min-width or render an
invisible placeholder when errors.name is falsy). Concretely, update the wrapper
under the name input and the description input (the containers around FieldError
and the counter) so FieldError (component reference: FieldError) always renders
an element of consistent width (either by adding a wrapper div with a fixed
min-w, adding aria-hidden/invisible text when no message, or switching the
container to justify-end and aligning the counter to the right) to prevent the
character counter from shifting.
---
Outside diff comments:
In `@src/components/admin/club-info/ClubInfoContactSection.tsx`:
- Around line 31-36: Replace the hard-coded pixel padding on the AdminInfoCard
by using the spacing token system: change the className value that currently
contains "pb-[40px]" to use the token "pb-800" (on the AdminInfoCard JSX
element) so the component's padding aligns with the design token scale and
avoids inline px values.
In `@src/components/admin/club-info/ClubInfoPageContent.tsx`:
- Around line 132-139: The wrapper div in ClubInfoPageContent (the element
rendering ClubInfoTopBar when isEditMode is true) uses className "flex w-full
flex-col overflow-x-auto", which creates an internal scroll container and breaks
ClubInfoTopBar's sticky positioning; remove the overflow-x-auto from that
wrapper so the sticky top-0 on ClubInfoTopBar is relative to the viewport
(mirror the approach used in MemberPageContent), then run the page to verify the
top bar stays fixed when editing.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: a63654d8-0cc2-4458-8903-bfce2123382c
📒 Files selected for processing (8)
src/app/(private)/[clubId]/admin/layout.tsxsrc/components/admin/club-info/AdminInfoCard.tsxsrc/components/admin/club-info/ClubInfoBasicSection.tsxsrc/components/admin/club-info/ClubInfoContactSection.tsxsrc/components/admin/club-info/ClubInfoPageContent.tsxsrc/components/admin/club-info/FieldBlock.tsxsrc/components/auth/hub/CreateClubForm.tsxsrc/components/ui/Input.tsx
🤖 Claude 테스트 제안
변경된 컴포넌트에 대해 Claude가 생성한 테스트 코드입니다. 검토 후 적합한 부분만 사용하세요.
|
PR 테스트 결과✅ Jest: 통과 🎉 모든 테스트를 통과했습니다! |
|
구현한 기능 Preview: https://weeth-p6nkh2tsu-weethsite-4975s-projects.vercel.app |
PR 검증 결과✅ TypeScript: 통과 🎉 모든 검증을 통과했습니다! |
✅ PR 유형
어떤 변경 사항이 있었나요?
📌 관련 이슈번호
✅ Key Changes
📸 스크린샷 or 실행영상
2026-04-29.11.29.45.mov
🎸 기타 사항 or 추가 코멘트
Summary by CodeRabbit
릴리스 노트
새로운 기능
스타일